<template>
  <div>
    <VueTinymce
      v-model="content"
      :setting="setting"
    />
  </div>
</template>

<script lang="ts">
import { Vue, Component } from 'vue-property-decorator'

@Component
export default class CommonTinymce extends Vue {
  public content: string = '<h1 style="text-align: center;">长恨歌</h1>'
  public setting: object = {
    menubar: false,
    toolbar:
      'undo redo | fullscreen | formatselect alignleft aligncenter alignright alignjustify | link unlink | numlist bullist | image media table | fontselect fontsizeselect forecolor backcolor | bold italic underline strikethrough | indent outdent | superscript subscript | removeformat |',
    toolbar_drawer: 'sliding',
    quickbars_selection_toolbar:
      'removeformat | bold italic underline strikethrough | fontsizeselect forecolor backcolor',
    plugins: 'link image media table lists fullscreen quickbars',
    language: 'zh_CN',
    height: 350,
  }
}
</script>
<style lang="scss" scoped>
</style>
